import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import _applyDecoratedDescriptor from "@babel/runtime/helpers/esm/applyDecoratedDescriptor";
import _isUndefined from "lodash/isUndefined";

var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _class, _class2;

/**
 * DateTimeFormat.js
 * @date 2018/11/27

 */
import React from 'react';
import { Bind } from 'lodash-decorators';
import { Button, Form, Select } from 'antd';
import moment from 'moment';
import { DEFAULT_DATE_FORMAT, DEFAULT_TIME_FORMAT } from 'utils/constants';
import intl from 'utils/intl';
import { timeZone2MomentUTC } from 'utils/renderer';
import MaxLenItem from "./components/MaxLenItem";
var itemContentStyle = {
  width: 240
};
var btnStyle = {
  marginLeft: 8
};
/**
 * 如果curValue为 undefined 则使用 defaultValue 否则使用 curValue
 * @param {*} curValue
 * @param {*} defaultValue
 */

function undefinedCon(curValue, defaultValue) {
  return _isUndefined(curValue) ? defaultValue : curValue;
}

var DateTimeFormat = (_dec = Form.create({
  fieldNameProp: null
}), _dec2 = Bind(), _dec3 = Bind(), _dec4 = Bind(), _dec5 = Bind(), _dec6 = Bind(), _dec7 = Bind(), _dec8 = Bind(), _dec9 = Bind(), _dec10 = Bind(), _dec(_class = (_class2 = /*#__PURE__*/function (_React$Component) {
  _inherits(DateTimeFormat, _React$Component);

  var _super = _createSuper(DateTimeFormat);

  function DateTimeFormat() {
    var _this;

    _classCallCheck(this, DateTimeFormat);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _super.call.apply(_super, [this].concat(args));
    _this.state = {
      dateFormatProps: {
        editing: false
      },
      timeFormatProps: {
        editing: false
      },
      currentMoment: moment()
    };
    return _this;
  }

  _createClass(DateTimeFormat, [{
    key: "render",
    value: function render() {
      return /*#__PURE__*/React.createElement(React.Fragment, null, this.renderDateFormat(), this.renderTimeFormat());
    }
  }, {
    key: "componentDidMount",
    value: function componentDidMount() {
      this.timer = setInterval(this.updateDate, 500);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      clearInterval(this.timer);
    }
  }, {
    key: "renderDateFormat",
    value: function renderDateFormat() {
      var _this$props = this.props,
          _this$props$userInfo = _this$props.userInfo,
          userInfo = _this$props$userInfo === void 0 ? {} : _this$props$userInfo,
          _this$props$dateMap = _this$props.dateMap,
          dateMap = _this$props$dateMap === void 0 ? {} : _this$props$dateMap,
          form = _this$props.form,
          updateDateFormatLoading = _this$props.updateDateFormatLoading;
      var _this$state = this.state,
          _this$state$dateForma = _this$state.dateFormatProps.editing,
          editing = _this$state$dateForma === void 0 ? false : _this$state$dateForma,
          currentMoment = _this$state.currentMoment;
      var content = currentMoment.format(undefinedCon(userInfo.dateFormat, DEFAULT_DATE_FORMAT));
      var comment = intl.get('ciam.userInfo.view.message.date').d('日期首选项，选择不同的日期格式');
      var btns = [];

      if (editing) {
        // comment = '';
        content = /*#__PURE__*/React.createElement(React.Fragment, null, form.getFieldDecorator('dateFormat', {
          initialValue: undefinedCon(userInfo.dateFormat, DEFAULT_DATE_FORMAT)
        })( /*#__PURE__*/React.createElement(Select, {
          style: itemContentStyle
        }, Object.values(dateMap).map(function (date) {
          return /*#__PURE__*/React.createElement(Select.Option, {
            key: date.value,
            value: date.value
          }, currentMoment.format(date.value));
        }))), /*#__PURE__*/React.createElement(Button, {
          key: "save",
          type: "primary",
          loading: updateDateFormatLoading,
          style: btnStyle,
          onClick: this.handleDateFormatUpdate
        }, intl.get('cpaas.common.button.save').d('保存')), /*#__PURE__*/React.createElement(Button, {
          key: "cancel",
          style: btnStyle,
          onClick: this.handleDateFormatEditCancel
        }, intl.get('cpaas.common.button.cancel').d('取消')));
      } else {
        btns.push( /*#__PURE__*/React.createElement(Button, {
          key: "update",
          onClick: this.handleDateFormatEdit
        }, intl.get('cpaas.common.button.update').d('修改')));
      }

      return /*#__PURE__*/React.createElement(MaxLenItem, {
        itemIcon: null,
        description: intl.get('ciam.userInfo.model.user.date').d('日期格式'),
        content: content,
        comment: comment,
        btns: btns
      });
    }
  }, {
    key: "renderTimeFormat",
    value: function renderTimeFormat() {
      var _this$props2 = this.props,
          _this$props2$userInfo = _this$props2.userInfo,
          userInfo = _this$props2$userInfo === void 0 ? {} : _this$props2$userInfo,
          _this$props2$timeMap = _this$props2.timeMap,
          timeMap = _this$props2$timeMap === void 0 ? {} : _this$props2$timeMap,
          form = _this$props2.form,
          updateTimeFormatLoading = _this$props2.updateTimeFormatLoading;
      var _this$state2 = this.state,
          _this$state2$timeForm = _this$state2.timeFormatProps.editing,
          editing = _this$state2$timeForm === void 0 ? false : _this$state2$timeForm,
          currentMoment = _this$state2.currentMoment;
      var content = currentMoment.utcOffset(undefinedCon(timeZone2MomentUTC[userInfo.timeZone], 8)).format(undefinedCon(userInfo.timeFormat, DEFAULT_TIME_FORMAT));
      var comment = intl.get('ciam.userInfo.view.message.time').d('时间首选项，选择不同的时间格式');
      var btns = [];

      if (editing) {
        // comment = '';
        content = /*#__PURE__*/React.createElement(React.Fragment, null, form.getFieldDecorator('timeFormat', {
          initialValue: undefinedCon(userInfo.timeFormat, DEFAULT_TIME_FORMAT)
        })( /*#__PURE__*/React.createElement(Select, {
          style: itemContentStyle
        }, Object.values(timeMap).map(function (time) {
          return /*#__PURE__*/React.createElement(Select.Option, {
            key: time.value,
            value: time.value
          }, currentMoment.utcOffset(undefinedCon(timeZone2MomentUTC[userInfo.timeZone], 8)).format(time.value));
        }))), /*#__PURE__*/React.createElement(Button, {
          key: "save",
          type: "primary",
          style: btnStyle,
          loading: updateTimeFormatLoading,
          onClick: this.handleTimeFormatUpdate
        }, intl.get('cpaas.common.button.save').d('保存')), /*#__PURE__*/React.createElement(Button, {
          key: "cancel",
          style: btnStyle,
          onClick: this.handleTimeFormatEditCancel
        }, intl.get('cpaas.common.button.cancel').d('取消')));
      } else {
        btns.push( /*#__PURE__*/React.createElement(Button, {
          key: "update",
          onClick: this.handleTimeFormatEdit
        }, intl.get('cpaas.common.button.update').d('修改')));
      }

      return /*#__PURE__*/React.createElement(MaxLenItem, {
        itemIcon: null,
        description: intl.get('ciam.userInfo.model.user.time').d('时间格式'),
        content: content,
        comment: comment,
        btns: btns
      });
    }
  }, {
    key: "updateDate",
    value: function updateDate() {
      this.setState({
        currentMoment: moment()
      });
    } // date-format

  }, {
    key: "handleDateFormatEdit",
    value: function handleDateFormatEdit() {
      this.setState({
        dateFormatProps: {
          editing: true
        }
      });
    }
  }, {
    key: "handleDateFormatEditCancel",
    value: function handleDateFormatEditCancel() {
      this.setState({
        dateFormatProps: {
          editing: false
        }
      });
    }
  }, {
    key: "handleDateFormatUpdate",
    value: function handleDateFormatUpdate() {
      var _this2 = this;

      var form = this.props.form;
      form.validateFields(['dateFormat'], function (err, data) {
        if (!err) {
          var onDateFormatUpdate = _this2.props.onDateFormatUpdate;
          onDateFormatUpdate(data.dateFormat).then(function (res) {
            if (res) {
              _this2.handleDateFormatEditCancel();
            }
          });
        }
      });
    } // time-format

  }, {
    key: "handleTimeFormatEdit",
    value: function handleTimeFormatEdit() {
      this.setState({
        timeFormatProps: {
          editing: true
        }
      });
    }
  }, {
    key: "handleTimeFormatEditCancel",
    value: function handleTimeFormatEditCancel() {
      this.setState({
        timeFormatProps: {
          editing: false
        }
      });
    }
  }, {
    key: "handleTimeFormatUpdate",
    value: function handleTimeFormatUpdate() {
      var _this3 = this;

      var form = this.props.form;
      form.validateFields(['timeFormat'], function (err, data) {
        if (!err) {
          var onTimeFormatUpdate = _this3.props.onTimeFormatUpdate;
          onTimeFormatUpdate(data.timeFormat).then(function (res) {
            if (res) {
              _this3.handleTimeFormatEditCancel();
            }
          });
        }
      });
    }
  }]);

  return DateTimeFormat;
}(React.Component), (_applyDecoratedDescriptor(_class2.prototype, "renderDateFormat", [_dec2], Object.getOwnPropertyDescriptor(_class2.prototype, "renderDateFormat"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "renderTimeFormat", [_dec3], Object.getOwnPropertyDescriptor(_class2.prototype, "renderTimeFormat"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "updateDate", [_dec4], Object.getOwnPropertyDescriptor(_class2.prototype, "updateDate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDateFormatEdit", [_dec5], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDateFormatEdit"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDateFormatEditCancel", [_dec6], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDateFormatEditCancel"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleDateFormatUpdate", [_dec7], Object.getOwnPropertyDescriptor(_class2.prototype, "handleDateFormatUpdate"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleTimeFormatEdit", [_dec8], Object.getOwnPropertyDescriptor(_class2.prototype, "handleTimeFormatEdit"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleTimeFormatEditCancel", [_dec9], Object.getOwnPropertyDescriptor(_class2.prototype, "handleTimeFormatEditCancel"), _class2.prototype), _applyDecoratedDescriptor(_class2.prototype, "handleTimeFormatUpdate", [_dec10], Object.getOwnPropertyDescriptor(_class2.prototype, "handleTimeFormatUpdate"), _class2.prototype)), _class2)) || _class);
export { DateTimeFormat as default };